<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ include file="../base_top.jsp" %>
<!DOCTYPE HTML>
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>个人注册</title>
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<script type="text/javascript" src="<%=basePath%>js/jquery-1.4.3.min.js"></script>
	<script type="text/javascript">
	$(function () {    
	    $("#Verify").click(function(){  
	            $(this).attr("src","reg/securityCodeImage?timestamp="+new Date().getTime());
	            $("#codetip").text("验证码错误");
	    });
	    
	    var name_right = false;
	    var pwd_right = false;
	    var repwd_right = false;
	    var email_right = false;
	    var code_right = false;
	    
	    
	    $("#userName").blur(function() {
	    	var username = $(this).val();
	    	if (username.trim() != "") {
	    		$.ajax({
					cache: false,
					url:"reg/checkUserExists",
					type: "GET",
					data: {name: username},
					dataType:"json",
				    success: function(data) {
				    	if(data == "exists") {
				    		$("#nametip").text("用户名已存在");
				    		name_right = false;
				    	} else {
				    		$("#nametip").text("√");
				    		name_right = true;
				    	}
				    }
				});
	    	} else {
	    		name_right = false;
	    	}
	    });
	    
	    $("#pwd").blur(function() {
	    	var pwd = $("#pwd").val().trim();
	    	var length = pwd.length;
	    	if (length < 6) {
	    		$("#pwdtip").text("密码长度至少六位");
	    		pwd_right = false;
	    	} else {
	    		$("#pwdtip").text("√");
	    		pwd_right = true;
	    	}
	    });
	    
	    $("#repwd").blur(function() {
	    	var repwd = $(this).val().trim();
	    	var pwd = $("#pwd").val().trim();
	    	if (pwd != "") {
	    		if (repwd == pwd) {
		    		$("#repwdtip").text("√");
		    		repwd_right = true;
		    	} else {
		    		$("#repwdtip").text("密码不一致");
		    		repwd_right = false;
		    	};
	    	} else {
	    		repwd_right = false;
	    	}
	    });
	    
	    $("#email").blur(function() {
	    	var reg = /^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/;
	    	var email = $("#email").val().trim();
	    	if(!reg.test(email)) {
	    		$("#emailtip").text("邮箱地址不符合规范");
	    		email_right = false;
	    	} else {
	    		$("#emailtip").text("√");
	    		email_right = true;
	    	};
	    });
	    
	    $("#secCode").blur(function() {
	    	var secCode = $(this).val();
	    	$.ajax({
				cache: false,
				url:"reg/checkCodeRight",
				type: "GET",
				data: {secCode: secCode},
				dataType:"json",
			    success: function(data) {
			    	if(!data) {
			    		$("#codetip").text("验证码错误");
			    		code_right = false;
			    	} else {
			    		$("#codetip").text("√");
			    		code_right = true;
			    	}
			    }
			});
	    });
	    
	    $("#sbtn").click(function() {
	    	if (name_right && pwd_right && repwd_right && email_right && code_right) {
	    		$("#reg_form").submit();
	    	} else {
	    		$("#reg_msg").show().delay(1000).hide(0);
	    		return false;
	    	}
	    });
	});  
	</script>
  </head>
  
  <body>
    <div>
    <form id="reg_form" action="reg/eRegister" method="post">
    	<input type="hidden" name="user.userRole" value="4"/>
    	<label id="reg_msg" style="display:none">请完成表格内容</label>
    	<table border=1>
    		<tr><td>用  户  名</td> <td><input type="text" id="userName" name="user.userName" placeholder="请输入用户名"/></td><td><label id="nametip"></label></td></tr>
    		<tr><td>设置密码</td> <td><input type="password" id="pwd" name="user.userPasswd" placeholder=""/></td><td><label id="pwdtip"></label></td></tr>
    		<tr><td>确认密码</td> <td><input type="password" id="repwd" name="rePasswd" placeholder=""/></td><td><label id="repwdtip"></label></td></tr>
    		<tr><td>邮箱地址</td> <td><input type="text" id="email" name="user.userEmail" placeholder=""/></td><td><label id="emailtip"></label></td></tr>
    		<tr><td>验证码</td> <td><input type="text" id="secCode" name="secCode"/> <img src="reg/securityCodeImage.action" id="Verify" style="cursor:pointer;" alt="看不清，换一张" /></td><td><label id="codetip"></label></td></tr>
    		<tr><td colspan="2"><input id="sbtn" type="button" value="立即注册"/></td></tr>
    	</table>
    </form>
    </div>
  </body>
</html>
